<template>
	<view>
		<view class="zy-status-bar"></view>
		<view class="zy-row-between" style="position: relative; height: 80rpx;">
			<view class="zy-row">
				<slot>
					<view class="zy-row-center" style="width: 80rpx; height: 80rpx;" v-if="!hideBack" @click="onBack()">
						<image :src="$getImageUrl('ic_arrow_left_gray.png')" style="width: 15rpx;" mode="widthFix">
						</image>
					</view>
				</slot>
				<view class="zy-text-white-lg-bold" v-if="leftTitle">{{leftTitle}}</view>
			</view>
			<view class="zy-row">
				<view class="zy-row" @click="onRight2">
					<slot name='right2'>
						<image class="zy-icon" mode="widthFix" :src="$getImageUrl(`${rightIcon2}`)" v-if="rightIcon2"></image>
						<view class="zy-text-white-bold  zy-p" v-if="rightText2">{{rightText2}}</view>
					</slot>
				</view>
				<view class="zy-row" @click="onRight">
					<slot name='right'>
						<image class="zy-icon" mode="widthFix" :src="$getImageUrl(`${rightIcon}`)" v-if="rightIcon"></image>
						<view class="zy-text-white-bold zy-p" v-if="rightText">{{rightText}}</view>
					</slot>
				</view>
			</view>

			<view class="zy-row-center zy-text-white-lg-bold" style="position: absolute; z-index: -1;  width: 100%;">
				{{title}}
				<slot name='title'></slot>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	const emit = defineEmits(['right', 'right2'])
	
	const props = defineProps({
		hideBack: {
			type: Boolean,
			default: () => false
		},
		title: {
			type: String,
			default() {
				return ''
			}
		},
		leftTitle: {
			type: String,
			default() {
				return ''
			}
		},
		rightText: {
			type: String,
			default() {
				return ''
			}
		},
		rightIcon: {
			type: String,
			default() {
				return ''
			}
		},
		rightText2: {
			type: String,
			default() {
				return ''
			}
		},
		rightIcon2: {
			type: String,
			default() {
				return ''
			}
		},
	})

	
	const onBack = () => {
		uni.navigateBack()
	}

	const onRight = () => {
		emit('right')
	}

	const onRight2 = () => {
		emit('right2')
	}
</script>

<style>

</style>